/** @format */

import { createApp } from "vue";
import App from "./App.vue";
import {
  createRouter,
  createWebHashHistory,
  createWebHistory,
} from "vue-router";
import HomePage from "@/pages/Home.vue";
import AboutPage from "@/pages/About.vue";
import NewsPage from "@/pages/News.vue";
import News1 from "@/pages/NewsDetail1.vue";
import News2 from "@/pages/NewsDetail2.vue";
//配置路由规则
const routes = [
  { path: "/", redirect: "/home" }, //默认跳转都⾸⻚
  { path: "/home", component: HomePage },
  { path: "/about", component: AboutPage, name: "about" }, //命名路由
  // { path: "/news", component: NewsPage, name: "news" },
  {
    path: "/news",
    component: NewsPage,
    name: "news",
    children: [
      //⼦路由
      {
        name: "xinwen1",
        path: "1",
        component: News1,
      },
      {
        name: "xinwen2",
        path: "2",
        component: News2,
      },
    ],
  },
];
//创建路由器
const router = createRouter({
  history: createWebHistory(), //路由器⼯作模式 URL不带#，斜杠链接
  // history: createWebHashHistory(), //路由器⼯作模式 URL带#，hash链接,对SEO不太友好。⽐较适合内部系统
  routes,
});
//项⽬中，通常将两个配置项放到单独的ts⽂件中

const app = createApp(App);
//加载路由器
app.use(router);
app.mount("#app");
